<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body id="body">

</body>

</html>
<script>

    // JSONP(json数据+页面填充)
    // JSONP的形式解决跨域：
    // 把请求数据的形式转换成 <script> 引入资源

    // ajax不能跨域，一旦跨域就会出现一些错误，无法请求数据
    // 而 <script> 标签 可以引入其他js文件，引入的js文件可以是任何服务器上的资源，不受跨域资源共享政策的响应






</script>






<!-- script 可以引入任何文件，无论是引入什么文件，script都会把这个文件当做js文件来解析 -->


<script src="./data/1.txt"></script>
<script src="./data/2.js"></script>
<script src="./data/3.json"></script>
<script src="http://localhost:3000"></script>



<script>
    // 相当于在此处写了 let a="2.js"
    console.log(a);

    // 相当于在此处写了 let b="1.txt"
    console.log(b);

    // 相当于在此处写了 let c="3.json"
    console.log(c);


    // 相当于在此处写了 let d="服务器资源"
    console.log(d);//服务器资源


    // console.log(e);

    function fun(x) {
        console.log(x);
    }

    // 数据一般是需要的时候才会获取
    // p(padding填充)  当我们需要数据的时候，才引入http://localhost:3000/index


    let sc= document.createElement("script")
    // console.log(sc);
    sc.src="http://localhost:3000/index"

    body.appendChild(sc  )// sc添加到body( padding )


    // jsonp只能是get请求
    // ajax是new XMLHttpRequest() 实例化出来的，所以ajax最终发送的请求还是http请求

</script>


